博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
微信小程序(11)--购物车
阅读量:4336 次
发布时间:2019-06-07

本文共 3084 字,大约阅读时间需要 10 分钟。

今天记录一下购物车案例,实现购物车的全选,单选,数量加一减一,金额总数,以及清空购物车。

{
{item.title}}
¥{
{item.price}}
-
{ {item.num}}
+
×
全选
¥{
{totalPrice}}
购物车是空的哦~
// page/component/new-pages/cart/cart.jsPage({  data: {    carts:[],               // 购物车列表    hasList:false,          // 列表是否有数据    totalPrice:0,           // 总价,初始为0    selectAllStatus:true    // 全选状态,默认全选  },  onShow() {    this.setData({      hasList: true,      carts:[        {id:1,title:'白菜 半斤',image:'/image/s5.png',num:4,price:0.02,selected:true},        {id:2,title:'素米 500g',image:'/image/s6.png',num:1,price:0.05,selected:true}      ]    });    this.getTotalPrice();  },  /**   * 当前商品选中事件   */  selectList(e) {    const index = e.currentTarget.dataset.index;    let carts = this.data.carts;    const selected = carts[index].selected;    carts[index].selected = !selected;    this.setData({      carts: carts    });    this.getTotalPrice();  },  /**   * 删除购物车当前商品   */  deleteList(e) {    const index = e.currentTarget.dataset.index;    let carts = this.data.carts;    carts.splice(index,1);    this.setData({      carts: carts    });    if(!carts.length){      this.setData({        hasList: false      });    }else{      this.getTotalPrice();    }  },  /**   * 购物车全选事件   */  selectAll(e) {    let selectAllStatus = this.data.selectAllStatus;    selectAllStatus = !selectAllStatus;    let carts = this.data.carts;    for (let i = 0; i < carts.length; i++) {      carts[i].selected = selectAllStatus;    }    this.setData({      selectAllStatus: selectAllStatus,      carts: carts    });    this.getTotalPrice();  },  /**   * 绑定加数量事件   */  addCount(e) {    const index = e.currentTarget.dataset.index;    let carts = this.data.carts;    let num = carts[index].num;    num = num + 1;    carts[index].num = num;    this.setData({      carts: carts    });    this.getTotalPrice();  },  /**   * 绑定减数量事件   */  minusCount(e) {    const index = e.currentTarget.dataset.index;    let carts = this.data.carts;    let num = carts[index].num;    if(num <= 1){      return false;    }    num = num - 1;    carts[index].num = num;    this.setData({      carts: carts    });    this.getTotalPrice();  },  /**   * 计算总价   */  getTotalPrice() {    let carts = this.data.carts;                  // 获取购物车列表    let total = 0;    for(let i = 0; i

 

转载于:https://www.cnblogs.com/juewuzhe/p/8227799.html

你可能感兴趣的文章
VMware黑屏解决方法
查看>>
JS中各种跳转解析
查看>>
JAVA 基础 / 第八课:面向对象 / JAVA类的方法与实例方法
查看>>
Ecust OJ
查看>>
P3384 【模板】树链剖分
查看>>
Thrift源码分析(二)-- 协议和编解码
查看>>
考勤系统之计算工作小时数
查看>>
4.1 分解条件式
查看>>
Equivalent Strings
查看>>
flume handler
查看>>
收藏其他博客园主写的代码,学习加自用。先表示感谢!!!
查看>>
H5 表单标签
查看>>
su 与 su - 区别
查看>>
C语言编程-9_4 字符统计
查看>>
在webconfig中写好连接后,在程序中如何调用?
查看>>
限制用户不能删除SharePoint列表中的条目(项目)
查看>>
feign调用spring clound eureka 注册中心服务
查看>>
ZT:Linux上安装JDK,最准确
查看>>
LimeJS指南3
查看>>
关于C++ const成员的一些细节
查看>>